Originally opened as #4822 but closed because of some git branch issue.

Launch Checklist

• Confirm your changes do not include backports from Mapbox projects (unless with a compliant license) - if you are not sure about this, please ask!
• Briefly describe the changes in this PR.
• Link to related issues.
• Include before/after visuals or gifs if this PR includes visual changes.
• Write tests for all new functionality. Read bellow
• Document any changes to public APIs.
• Post benchmark scores.
• Add an entry to CHANGELOG.md under the ## main section.

Description

This PR addresses how failed HTTP requests due to CORS policy are handled. So far, if a request fails because of CORS, it does not return a response, instead, it makes the browser throw a generic TypeError ( see here ). As a result, a map instance subscribing to the "error" event would catch a generic error that does not include the faulty URL. It is better to handle a CORS error with an AJAXError, that contains information about the URL and the cause of the actual problem.

This is especially useful in the context of loading a style.json so that if a given style is not reachable because of CORS, it is possible to catch this error with the same efficiency as if fetching a style.json would yield an HTTP 5xx status code, since in both cases the request would fails due to server configuration.

This fix also addresses other network issues such as DNS resolution failures or malformed URLs

Before / After

With this minimalist snippet:

const map = new maplibregl.Map({
  container: 'map',
  style: "https://example.com/style.json",
});

map.on("error", (err) => {
  console.log(">>> ", err);
}) 

Here is the console output,

• BEFORE:

• AFTER:

Test

I tried adding another test to src/util/ajax.test.ts but it is impossible to simulate a CORS with the Nise package's FakeServer, since a CORS error is not part of the server response but is due to the browser blocking it.

Other info

• This makes no change to public API.
• this does not affect performance